<template>
    <div>
      <Table :columns="columns"
             :showPagination="true"
             :dataSource="commentsData"
             :fetch="loadCommentsList"
             :options="commentsOptions"
             @pageNoChange="handlePageNoChange">
        <template #opration="{row}">
          <div class="opration">
            <a href="javascript:void(0)"
               class="a-link"
               @click="del(row)">删除</a>
          </div>
        </template>
      </Table>
    </div>
  </template>
    
  <script>
  import { getCurrentInstance, nextTick } from 'vue';
  
  export default {
      data(){
          return{
              currentPage: 1,
              proxy: getCurrentInstance().proxy,
              columns:[
              {
                  label:"文章标题",
                  prop:"articleTitle",
                  width: 200,
              },
              {
                  label:"评论内容",
                  prop:"content",
              },
              {
                  label:"评论时间",
                  prop:"created",
                  width:300,
              },
              {
                  label:"操作",
                  prop:"opration",
                  width: 150,
                  scopedSlots: "opration"
              }],
              commentsData:{
                list:[]
              },
              commentsOptions: {
                border:true,
                extHeight: 10
              },
          };
      },
      methods: {
        //加载数据
        async loadCommentsList(){
          try {
            let result = await this.proxy.Request({
              url: "comments/currentUser",
              method: "GET",
              params:{
                token:'',
                page:this.currentPage,
              }
            });
  
            if (!result){
              return;
            }
            this.commentsData.list = result.data.rows;
          } catch(error){
            console.error("获取评论数据时出错：",error)
          }
        },
  
        //删除评论
        del(data) {
          this.proxy.Confirm('你确定要删除该评论吗?', async() => {
            let result = await this.proxy.Request({
              url: '/comments/'+data.id,
              method: "DELETE",
              params: {
                id: data.id,
              }
            })
            if (!result) {
              return;
            }
            this.loadCommentsList();
          })
        },
  
        handlePageNoChange(pageNo) {
            console.log('?page=',pageNo);
            this.currentPage = pageNo;
            console.log('?pageNow=',this.currentPage);
            const url = 'comments/?page='+this.currentPage;
            console.log(url);
        },
        
      },
      mounted(){
        this.loadCommentsList();
      },
  }
  </script>
  
  <style>
  
  </style>